<template>
  <div class="parent">
    <child/>
    <button @click="handleClick">触发事件</button>
  </div>
</template>
<script>
import child from './Child'
import Emitter from '@/mixins/emitter.js'

export default {
  name: 'parent',
  provide() {
    return {
      parentCom: this,
      pagenation: this.list,
      name: this.name
    }
  },
  mixins: [Emitter],
  components: {
    child
  },
  data() {
    return {
      list: ['文章','话题', '动态'],
      name: 'PC'
    }
  },
  mounted () {
    this.$on('on-msg', (text) => {
      console.log('text', text)
    })
    console.log('获取到的子级', this.$children)
  },
  watch: {
    list(newVal) {
      console.log('newVal', newVal)
    },
    name(newVal) {
      console.log('name', newVal)
    }
  },
  methods: {
    changeName (name) {
      this.name = name
    },
    handleClick () {
      this.broadcast('child', 'on-message', 'Hello Vue.js');
    }
  }
}
</script>